<template>
    <div>
        <van-nav-bar title="题库选择" left-text="返回" left-arrow @click-left="onClickLeft" />
        <van-sidebar v-model="activeKey" style="float: left;">
            <van-sidebar-item :title="item.name" v-for="(item, index) in zc" :key="index" @click=add(item.id)>
            </van-sidebar-item>
        </van-sidebar>
        <div style="float: left;" class="qwe">
            <div v-for="(item, index) in yc" :key="index">
                {{ item.name }}
                <div class="nnaa" v-for="(item1, index1) in item.bank" :key="index1">
                    <ul>
                        <li>
                            {{ item1.name }}
                        </li>
                    </ul>
                    <b class="nana">
                        
                    </b>
                        
                    
                </div>
            </div>
        </div>

    </div>
</template>
    
<script>
export default {
    data() {
        return {
            activeKey: 0,
            zc: [],
            id: 0,
            yc: []
        }
    },
    //生命周期 - 创建完成（访问当前this实例）
    created() {
        this.$axios.get('http://xl.9yuecloud.com/api/wap/classify').then((res) => {
            console.log(res)
            this.zc = res.data.data
            console.log(this.zc)
        })
        this.$axios.get('http://xl.9yuecloud.com/api/wap/quesBank/60?')
    },
    //生命周期 - 挂载完成（访问DOM元素）
    mounted() {

    },
    methods: {
        onClickLeft() {
            this.$router.go(-1)
        },
        add(id) {
            console.log(id)
            this.$axios.get('http://xl.9yuecloud.com/api/wap/quesBank/' + id).then((res) => {
                console.log(res)
                this.yc = res.data.data
                console.log(this.yc)
            })
        }
    }
}
</script>
<style scoped>

.nnaa{
    width: 100%;
    height: 100%;
}
li{
    /* padding: .107rem .533rem; */
    width: 100px;
    background: #f2f3f5;
    margin: .133rem .133rem;
    /* border-radius: .053rem; */
    text-align: center;
    display:inline-flex;
}
</style>